<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>

		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="css/animate.css" />
		<link rel="stylesheet" type="text/css" href="css/jiazai.css" />
		<link rel="stylesheet" type="text/css" href="css/index3.css" />

	</head>

	<body style="background: #f5f8ff;">
		<div id="app">

			<!-- 加载中动画 -->
			<div id='jiazai-ani' v-if='jiazai'>
				<div class="arc"></div>
				<h1><span>LOADING</span></h1>
			</div>
			<!-- 加载中动画 -->

			<div id="hea-wrap">
				<div class="dis-spa hea-con">
					<img src="img/left.svg" style="width:25px;height: 25px;opacity: 0;" />
					<span>闪兑</span>
					<img @tap="_indexOpenHref({url:'exchange-order.html',id:'exchangeOrder'})" src="img/order.svg" style="width:25px;height: 25px;" />
				</div>
			</div>
			<div style="margin-top: 60px;padding:0 20px;">
				<div class="trans-wrap">
					<div class="coins-info">
						<p class='dis-spa trans-intro'>
							<span>卖出</span>
							<span>买入</span>
						</p>
						<div class="dis-spa chan-coins">
							<div class="dis-cen chan-1" @tap="chanCoins('out')">
								<img src="img/timg.png" />
								<span>BTC</span>
							</div>
							<div class="dis-cen chan-2">
								<img src="img/exch.svg" />
							</div>
							<div class="dis-cen chan-3" @tap="chanCoins('in')">
								<span>BTC</span>
								<img src="img/timg.png" />
							</div>
						</div>
					</div>
					<div class="coins-input">
						<p class='dis-spa trans-intro'>
							<span>数量</span>
							<span>数量（预估）</span>
						</p>
						<div class='dis-spa ex-input'>
							<input type="text" placeholder="输入数量" />
							<input type="text" placeholder="输入数量" />
						</div>
					</div>
					<div class="coins-oth-mon">
						<p>
							<span>汇率：</span>
							<span>1</span>
							<span>BTC</span>
							<span>≈</span>
							<span>36.00021</span>
							<span>ETH</span>
						</p>
						<p>
							<span>手续费：</span>
							<span>≈</span>
							<span>36.00021</span>
							<span>ETH</span>
						</p>
					</div>
				</div>
				<p class='coins-tran-intro'>0.001245454≥BTC卖出量≤1.014121212</p>
				<button class='ex-btn'>确认兑换</button>
			</div>
		</div>
		<script src="js/comm.js"></script>
		<script src="js/vue.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/mui.min.js"></script>
		<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" charset="utf-8">
			var app = new Vue({
				el: '#app',
				data: {
					jiazai: false,
					//判断-卖出/买入  out:卖出  in:'买入'
					type: 'out'
				},
				created: function() {

				},
				methods: {
					//选择币种
					chanCoins: function(who) {
						this.type = who;
						var curr = plus.webview.currentWebview();
						//打开输入密码页面
						var op = {
							'backButtonAutoControl': 'close', //返回是关闭当前页
							'height': '350px',
							'bottom': '0',
							'background': 'transparent'
						};
						var web = plus.webview.create('change-coins.html', 'changeCoins', op);
						web.addEventListener("loaded", function() {
							setTimeout(function() {
								//这里把数据传到选择币种页面，然后那边把选择的数据导入回来
								web.evalJS("send()");
							}, 300);
							web.show('slide-in-bottom');
							curr.setStyle({
								mask: 'rgba(0,0,0,0.5)'
							});
							curr.addEventListener('maskClick', function() {
								plus.webview.currentWebview().setStyle({
									mask: 'none'
								});
								web.close('none');
							}, false);
						}, false);
						web.onclose = function() {
							curr.setStyle({
								mask: 'none'
							});
						};
					}
				}
			});
			var first = null;
			mui.back = function() {
				//首次按键，提示‘再按一次退出应用’
				if(!first) {
					first = new Date().getTime();
					plus.nativeUI.toast("再按一次退出程序");
					setTimeout(function() {
						first = null;
					}, 1000);
				} else {
					if(new Date().getTime() - first < 1000) {
						plus.runtime.quit();
					}
				}
			};
		</script>
	</body>

</html>